<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:c="http://java.sun.com/jstl/core"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui">
<ui:composition template="../templates/layout.xhtml">
	<ui:define name="content">
		<h:form prependId="false" id="growlForm">
			<p:growl id="growl" showDetail="false" />
		</h:form>
		<h:form prependId="false" id="dataForm">

			<p:panel id="data" toggleable="true" toggleSpeed="250">
				<f:facet name="header">
					<h:outputText value="#{ejemploBean.name}" />
				</f:facet>
				<h:outputFormat id="noRecordsFound"
					value="#{messages.label_no_records_found}"
					rendered="#{!ejemploBean.dataVisible}">
					<f:param value="Categorias" />
				</h:outputFormat>
				<p:dataTable id="list" value="#{ejemploBean.listaCategorias}"
					var="categoria" rendered="true" resizableColumns="false"
					paginator="true"
					paginatorTemplate=" {CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
					rowsPerPageTemplate="5,10,25,50" rows="10">
					<p:columns value="#{ejemploBean.columns}" var="column"
						columnIndexVar="colIndex">
						<f:facet name="header">
							<h:outputText value="#{applicationBean.getColumnName(column)}" />
						</f:facet>
						<h:outputText value="#{categoria[column]}" />
					</p:columns>
				</p:dataTable>
			</p:panel>
			<p:panelGrid columns="2">
				<p:row>
					<p:tree value="#{ejemploBean.root}" var="node" dynamic="true"
						cache="true" id="tree" selectionMode="single"
						selection="#{ejemploBean.selectedNode}">

						<p:ajax event="expand" update=":growlForm:growl"
							listener="#{ejemploBean.onNodeExpand}" />
						<p:ajax event="collapse" update=":growlForm:growl"
							listener="#{ejemploBean.onNodeCollapse}" />
						<p:ajax event="select" update=":growlForm:growl"
							listener="#{ejemploBean.onNodeSelect}" />
						<p:ajax event="unselect" update=":growlForm:growl"
							listener="#{ejemploBean.onNodeUnselect}" />

						<p:treeNode>
							<h:outputText value="#{node}" />
						</p:treeNode>
					</p:tree>
				</p:row>
			</p:panelGrid>

		</h:form>

	</ui:define>
</ui:composition>
</html>